﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/HomeSite.Master" Inherits="System.Web.Mvc.ViewPage<TimeTableManagement.Entities.Tb_Timetable>" %>

<%@ Register Assembly="DevExpress.Web.v11.1, Version=11.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxSplitter" TagPrefix="dx" %>

<%@ Register Assembly="DevExpress.Web.v11.1, Version=11.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxRoundPanel" TagPrefix="dx" %>

<%@ Register assembly="DevExpress.Web.v11.1, Version=11.1.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxPanel" tagprefix="dx" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

<script src="<%: Url.Content("~/Scripts/jquery.validate.min.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js") %>" type="text/javascript"></script>
<dx:ASPxRoundPanel ID="ASPxRoundPanel1" runat="server" Width="100%" 
        CssFilePath="~/App_Themes/Aqua/{0}/styles.css" CssPostfix="Aqua" 
        GroupBoxCaptionOffsetY="-28px" 
        SpriteCssFilePath="~/App_Themes/Aqua/{0}/sprite.css">
        <ContentPaddings Padding="14px" />
        <PanelCollection>
<dx:PanelContent ID="PanelContent1" runat="server" SupportsDisabledAttribute="True">
<% using (Html.BeginForm())
   { %>
    <%: Html.ValidationSummary(true)%>
<input id="count" name="count" value=0 type="hidden" />
<input type="hidden" id="timetablejson" name="timetablejson" value="[]" />
<div style="width=100%"> 
        <div class="editor-label">
            <%: Html.LabelFor(model => model.id_term, "Term")%>
        </div>
        <div class="editor-field">
            <%: Html.DropDownList("id_term", String.Empty)%>
            <%: Html.ValidationMessageFor(model => model.id_term)%>
            <b id="waiting"> </b>
        </div>
</div>
<div style="width=60%; float:left; text-align:left"> 
<div class="editor-label">Choose Course</div>
<div id="tablecourse">
    <table id="t1" class="example table-autosort
 table-autofilter table-autopage:5 
 table-stripeclass:alternate 
 table-filtered-rowcount:t1filtercount 
 table-rowcount:t1allcount">
     <thead> 
        <tr>
            <th style="width:auto" class="table-sortable:alphanumeric">
                Code
            </th>
            <th style="width:auto" class="table-sortable:alphanumeric">
                Name
            </th>
            <th style="width:auto"></th>
        </tr>
    </thead>
    <tbody>
    <% TimeTableManagement.QLSVContext db = new TimeTableManagement.QLSVContext();
       var list = db.Tb_Course.ToList(); %>
    <% foreach (var item in list)
       { %>
        <tr>
            <td>
                <%: Html.DisplayFor(modelItem => item.code) %>
            </td>
            <td>
                <%: TimeTableManagement.Models.Functions.Truncate(item.name,20)
                %>
            </td>
            <td>
                <img  alt="" src="../../Content/images/uncheck.png" />
            </td>
        </tr>
    <% } %>
    </tbody>
    <tfoot>
	    <tr>
		    <td class="table-page:previous" style="cursor:pointer;"><img src="../../Content/iconprevious.png" /></td>
		    <td><span id="t1allcount"></span></td>
            <td class="table-page:next" style="cursor:pointer;"> <img src="../../Content/iconnext.png" /></td>
	    </tr>
    </tfoot>
    </table>
</div>
    
</div>
<div style="width=30%; float:left;"> 
        <div class="editor-label">Lecturer</div>
        <div class="editor-field" id="lecturer_dropdown">
            <%: Html.DropDownList("id_lecturer", String.Empty) %>
            <%: Html.ValidationMessageFor(model => model.id_lecturer) %>
        </div>
        
        <div class="editor-label">
            <%: Html.LabelFor(model => model.id_slot, "Slot") %>
        </div>
        <div id="slot_dropdown" class="editor-field">
            <%: Html.DropDownList("id_slot", String.Empty) %>
            <%: Html.ValidationMessageFor(model => model.id_slot) %>
        </div>

        <div class="editor-label">
            <%: Html.LabelFor(model => model.id_room, "Room") %>
        </div>
        <div id="room_dropdown" class="editor-field">
            <%: Html.DropDownList("id_room", String.Empty) %>
            <%: Html.ValidationMessageFor(model => model.id_room) %>
        </div>

        <div class="editor-label">
            Allow Registry
        </div>
        <div class="editor-field">
            <%--<%: Html.EditorFor(model => model.status)%>--%>
            <input id="status" name="status" type="checkbox" checked=checked />
            <%: Html.ValidationMessageFor(model => model.status) %>
        </div>
    <input id="Button1" type="button" value="Add To TimeTable" onclick="return addtemplate()"/>
    <%--Khi click vao button nay thì cập nhật chuỗi json theo cấu trúc bên dưới và gửi post cho getTimeTableTem--%>
</div>
</div>
<% } %>
</dx:PanelContent>
</PanelCollection>
    </dx:ASPxRoundPanel>
    
<p></p>
    <dx:ASPxRoundPanel ID="ASPxRoundPanel2" runat="server" Width="100%" 
        CssFilePath="~/App_Themes/Aqua/{0}/styles.css" CssPostfix="Aqua" 
        GroupBoxCaptionOffsetY="-28px" HeaderText="Thời khóa biểu tạm"
        SpriteCssFilePath="~/App_Themes/Aqua/{0}/sprite.css">
        <ContentPaddings Padding="14px" />
        <PanelCollection>
<dx:PanelContent runat="server" SupportsDisabledAttribute="True">
<div id="timetabletable">
<table style="width:100%" id="Table1" class="example table-autosort
 table-autofilter table-autopage:5 
 table-stripeclass:alternate 
 table-page-number:t1page table-page-count:t1pages 
 table-filtered-rowcount:t1filtercount 
 table-rowcount:t1allcount">
<thead>
    <tr>
        <th class="table-sortable:alphanumeric">
            Code
        </th>
        <th class="table-sortable:alphanumeric">
            Name
        </th>
        <th class="table-sortable:alphanumeric table-filterable">
            Lecturer
        </th>
        <th class="table-sortable:alphanumeric table-filterable">
            Room
        </th>
        <th class="table-sortable:alphanumeric table-filterable">
            Slot
        </th>
        <th></th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>
        </td>
        <td>
        </td>
        <td>
        </td>
        <td>
        </td>
        <td>
        </td>
        <td>
        </td>
    </tr>

</tbody>
<tfoot>
	<tr>
		<td class="table-page:previous" style="cursor:pointer; text-align:right"><img src="../../Content/iconprevious.png" /></td>
		<td style="text-align:center" colspan="4"></td>
        <td class="table-page:next" style="cursor:pointer; text-align:left"> <img src="../../Content/iconnext.png" /></td>
	</tr>
</tfoot>
</table>
</div>
<input type="hidden" id="tempterm" value="" />
<input type="hidden" id="tempcourse" value="" />
<input type="hidden" id="templecturer" value="" />
<input type="hidden" id="tempslot" value="" />
<input type="hidden" id="temproom" value="" />

</dx:PanelContent>
</PanelCollection>
    </dx:ASPxRoundPanel>
    <button type="button" onclick="document.forms.namedItem('Form1').submit()"> Hoàn thành</button>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="HeadContent" runat="server">
<% 
    //Getting the current context of HTTP request
    var context = HttpContext.Current;
    //Formatting the fully qualified website url/name
    var appPath = string.Format("{0}://{1}{2}{3}",
                                context.Request.Url.Scheme,
                                context.Request.Url.Host,
                                context.Request.Url.Port == 80
                                    ? string.Empty
                                    : ":" + context.Request.Url.Port,
                                context.Request.ApplicationPath);

    if (!appPath.EndsWith("/"))
        appPath += "/";
%>
<script type="text/javascript">
    function showroom($id) {
        if ($id == "") {
            return;
        }
        $path = "<%: appPath  %>Room/Details2/" + $id;
        $.ajax({
            url: $path,
            context: "",
            success: function (data) {
                document.getElementById('roomdescription').textContent = data;
            }
        });
    }
    function showslot($id) {
        if ($id == "") {
            return;
        }
        $path = "<%: appPath  %>Slot/Details2/" + $id;
        $.ajax({
            url: $path,
            context: "",
            success: function (data) {
                document.getElementById('slotdescription').textContent = data;
            }
        });
    }
</script>
<script type="text/javascript">
    // update danh sach mon trong hoc ky
    function updateterm() {

        $id_term = document.getElementById('id_term').value.trim();
        $json = document.getElementById('timetablejson').value.trim();
        if ($id_term != "") {
            document.getElementById('waiting').innerHTML = "Vui lòng chờ cập nhật các môn học";
            $.ajax({
                type: "POST",
                url: "getCourseinTerm?idterm=" + $id_term + "&timetablejson="+ $json,
                success: function (data) {
                    document.getElementById('waiting').innerHTML = "";
                    document.getElementById('tablecourse').innerHTML = data;
                },
                error: function () {
                    document.getElementById('waiting').innerHTML = "Lỗi cập nhật môn học";
                }
            });
        }
        document.getElementById('tempterm').value = $id_term;
    }
</script>
<script type="text/javascript">
    $(function () {
        $("#id_term").change(function () {
            updateterm();
        });
    });
</script>
<script type="text/javascript">
    function resetradiogroup() {
        $items = document.getElementsByClassName("groupradio");
        for ($i = 0; $i < $items.length; $i++) {
            $item = $items.item($i);
            if ($item.src.search("uncheck") < 0) {
                $item.src = $item.src.replace("check", "uncheck");
                return;
            }
        }
    }
</script>
<script type="text/javascript">
    // cap nhat giang vien cho tung mon
    function updateteacher(radioitem) {

        if (radioitem.src.search("uncheck") < 0) {
            radioitem.src = radioitem.src.replace("check", "uncheck");
            return;
        }
        resetradiogroup();
        radioitem.src = radioitem.src.replace("uncheck", "check");
        $id_course = radioitem.id.trim();
        document.getElementById('waiting').innerHTML = "Vui lòng chờ cập nhật danh sách giảng viên";
        if ($id_course != "") {
            $.ajax({
                type: "POST",
                url: "getLecturerinCourse?idcourse=" + $id_course,
                success: function (data) {
                    document.getElementById('waiting').innerHTML = "";
                    document.getElementById('lecturer_dropdown').innerHTML = data;
                    $(function () {
                        $("#listlecturer").change(function (e) {
                            updateslot(this);
                        });
                    });
                },
                error: function () {
                    document.getElementById('waiting').innerHTML = "Lỗi cập nhật giảng viên của môn học";
                }
            });
        }
        document.getElementById('tempcourse').value = $id_course;
        document.getElementById('tempcourse').setAttribute("code", radioitem.getAttribute("code"));
        document.getElementById('tempcourse').setAttribute("namecode", radioitem.getAttribute("namecode").trim());
    }
</script>
<script type="text/javascript">
    function updateslot(e) {
        $id_lecturer = e.options[e.selectedIndex].value;
        document.getElementById('templecturer').value = $id_lecturer;
        document.getElementById('templecturer').setAttribute("code", e.options[e.selectedIndex].innerHTML);
        $id_term = document.getElementById('tempterm').value;
        document.getElementById('waiting').innerHTML = "Vui lòng chờ cập nhật danh sách slot";
        if ($id_lecturer != "" && $id_term != "") {
            $.ajax({
                type: "POST",
                url: "getSlotinLecturer?idterm=" + $id_term + "&idlecturer=" + $id_lecturer,
                success: function (data) {
                    document.getElementById('waiting').innerHTML = "";
                    document.getElementById('slot_dropdown').innerHTML = data;
                    $(function () {
                        $("#slot").change(function (e) {
                            updateroom(this);
                            showslot(this.options[this.selectedIndex].value);
                        });
                    });

                },
                error: function () {
                    document.getElementById('waiting').innerHTML = "Lỗi cập nhật slot của giảng viên";
                }
            });
        }
    }
</script>
<script type="text/javascript">
    function updateroom(e) {
        $id_slot = e.options[e.selectedIndex].value;
        document.getElementById('tempslot').value = $id_slot;
        document.getElementById('tempslot').setAttribute("code", e.options[e.selectedIndex].innerHTML);
        $id_term = document.getElementById('tempterm').value;
        $id_course = document.getElementById('tempcourse').value;
        document.getElementById('waiting').innerHTML = "Vui lòng chờ cập nhật danh sách phòng";
        if ($id_lecturer != "" && $id_term != "") {
            $.ajax({
                type: "POST",
                url: "getRoomInSlot_Course?idterm=" + $id_term + "&idslot=" + $id_slot + "&idcourse=" + $id_course,
                success: function (data) {
                    document.getElementById('waiting').innerHTML = "";
                    document.getElementById('room_dropdown').innerHTML = data;
                    $(function () {
                        $("#listroom").change(function (e) {
                            $id_room = this.options[this.selectedIndex].value;
                            $name_room = this.options[this.selectedIndex].innerHTML;
                            showroom($id_room);
                            document.getElementById("temproom").value = $id_room;
                            document.getElementById('temproom').setAttribute("code", $name_room);
                        });
                    });

                },
                error: function () {
                    document.getElementById('waiting').innerHTML = "Lỗi cập nhật phòng";
                }
            });
        }
    }
</script>
<script type="text/javascript">
    function updatejsontemp() {
        //$id_term = document.getElementById('tempterm').value.trim();
        //$code_term = document.getElementById('tempterm').getAttribute('code');
        $id_course = document.getElementById('tempcourse').value.trim();
        $code_course = document.getElementById('tempcourse').getAttribute('code');
        $name_course = document.getElementById('tempcourse').getAttribute('namecode');
        $id_lecturer = document.getElementById('templecturer').value.trim();
        $code_lecturer = document.getElementById('templecturer').getAttribute('code');
        $id_slot = document.getElementById('tempslot').value.trim();
        $code_slot = document.getElementById('tempslot').getAttribute('code');
        $id_room = document.getElementById('temproom').value.trim();
        $code_room = document.getElementById('temproom').getAttribute('code');
        $json = document.getElementById('timetablejson').value.trim();
        $newjsonitem = '{"id_course":' + $id_course + ',"code_course":"' + $code_course + '","name_course":"' + $name_course + '", '
                + '"id_lecturer":' + $id_lecturer + ',"name_lecturer":"' + $code_lecturer + '",'
                + '"id_room":' + $id_room + ',"name_room":"' + $code_room + '",'
                + '"id_slot":' + $id_slot + ',"name_slot":"' + $code_slot + '","yesorno":true}';
        if ($json.indexOf($newjsonitem) >= 0) {
            // item da ton tai
            return true;
        }
        if ($json.length < 2) {
            $json = '[]';
        }
        if ($json == "[]") {
            $json = '[' + $newjsonitem + ']';
        }
        else {
            $json = $json.replace("[{", '[' + $newjsonitem + ',{');
        }
        document.getElementById('timetablejson').value = $json;
        
        return true;
    }
</script>
<script type="text/javascript">
    function addtemplate() {
        // them lich hien tai
        updatejsontemp();
        $json = document.getElementById('timetablejson').value.trim();
        document.getElementById('waiting').innerHTML = "Cập nhật thời khóa biểu tạm";
        updatetimetabletemplate($json);
        document.getElementById('timetabletable');
        updateterm();
        return true;
    }
</script>
<script type="text/javascript">
    function updatetimetabletemplate($json) {
        $.ajax({
            type: "POST",
            url: "getTimetableTem?timetablejson=" + $json,
            success: function (data) {
                document.getElementById('waiting').innerHTML = "";
                document.getElementById('timetabletable').innerHTML = data;
            },
            error: function () {
                document.getElementById('waiting').innerHTML = "Lỗi cập nhật  bảng lịch tạm";
            }
        });
    }
</script>
<script type="text/javascript">
    function removeitemtemplate(e) {
        $jsonremove = e.getAttribute('json').trim();
        $json = document.getElementById('timetablejson').value.trim();
        if ($json.indexOf('[' + $jsonremove) >= 0) {
            // doi tuong o dau tien
            if ($json.indexOf('[' + $jsonremove + ']') >= 0) {
                // doi tuong la duy nhat
                $json = '[]';
            } else {
                $json = $json.replace($jsonremove + ',', "");
            }
        } else {
            $json = $json.replace(',' + $jsonremove, "");
        }
        document.getElementById('timetablejson').value = $json;
        updateterm();
        updatetimetabletemplate($json);
    }
</script>
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="leftmenu" runat="server">
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="menuright" runat="server">
</asp:Content>

<asp:Content ID="Content5" ContentPlaceHolderID="Footer" runat="server">
</asp:Content>
<%--
[{"id_course":id_course,"code_course":"Ma mon hoc","name_course":"ten mon hoc", "id_lecturer":2,"name_lecturer":"ten giang vien","id_room":3,"name_room":"ten room","id_slot":4,"name_slot":"ten slot","yesorno":true}]


--%>